var server;

chrome.extension.sendMessage({cmd: "server"}, function (response)
{
    server = response;

    // Inject CSS
    var style = document.createElement("style");
    style.type = "text/css";
    style.rel = "stylesheet";
    style.innerText = "@import url('" + server + "css/fbsmile.css');";
    document.head.appendChild(style);
});



function initialList(data)
{
    var $wrap = document.createElement("div"),
        html = '';
    $wrap.id = "fbsmile-list-wrap";

    html = '<div id="fbsmile-list-outer"><ul id="fbsmile-list">';
    var smiles = JSON.parse(data);
    for (var x in smiles)
    {
        if (smiles.hasOwnProperty(x))
        {
            html += "<li><span class='code'>:" + x + ":</span>" +
                '<span class="description"><img src="' + server + "x32/" + smiles[x][0] +
                '" alt="'+ x + '" />' +
                '<span class="describe">' + smiles[x][1] + '</span></span></li>';
        }
    }
    html += "</ul></div>";

    $wrap.innerHTML = html;

    document.body.appendChild($wrap);
}

chrome.extension.sendMessage({ cmd: "list"}, function (response)
{
    if (response)
    {
       initialList(response);
    }
    else
    {
        console.log("FbSmile: Không nhận được dữ liệu từ Server!");
    }
});


